{include file="./public/static/block/index/head.html"}
{include file="./public/static/block/index/leftNav.html"}

<!--内容-->
<div class="side-content " data-original="http://photo.lehur.com/1490694537.jpg">
    <!--搜索框 分类导航-->
    <div class="subnav-box ">
        <ul class="subnav-cut">
            <li class="subnav-bin subnav-search">
                <a><b><i class="fa fa-search"></i></b></a>

                <form method="get" action="">
                    <div class="form-group">
                        <div class="input-search">
                            <button type="submit" class="input-search-btn"><i class="icon wb-search" aria-hidden="true"></i></button>
                            <input class="form-control none-border" name="q" value="" placeholder="搜索">
                        </div>
                    </div>
                </form>

            </li>
            {volist name='cates' id='cate'}
              <li class="subnav-bin"><a href='{:get_index("product/index",["cate_id"=>$cate.cate_id])}'><b>{$cate.name}</b></a></li>
             {/volist}
        </ul>
    </div>
    <!--内容详情-->
    <div class="page met-showproduct pagetype1 animsition">
        <div class="met-showproduct-head">
            <div class="container">
                <div class="row">
                    <div class="col-md-7">
                        <div class="met-showproduct-list fnGallery text-center slick-dotted" id="met-imgs-carousel">
                            <div class="slick-slide lg-item-box"
                                 data-src="{$product.cover|get_uploads}"
                                 data-exthumbimage="{$product.thumb_cover|get_uploads}">
                            <span>
                                <img src="{$product.thumb_cover|get_uploads}"
                                     class="img-responsive"
                                     alt="Arumjigi modern tea cup">
                            </span>
                            </div>
                        </div>
                    </div>
                      <style>
                        .dd1{border-bottom: 1px dashed #ccc;line-height: 29px;}
                    </style>
                    <div class="col-md-5 product-intro">
                        <h1 class="pro-name">{$product.name}</h1>

                        <p>
                        </p>
                        <dd style="color:black; font-size: 22px;">￥：{$product.price}元 / {$product.unit}</dd>
                        <p></p>
                        {volist name='product.spec' id='s'}
                        <dd class="dd1">{$s}</dd>
                        {/volist}
                        <br>

                        <div class="w-shopping-cart">
                            <form action="" method="">
                                <p>
                                    <span>数量：</span>
                                    <var class="jian">-</var>
                                    <input class="w-num" type="number" value="1" name=""/>
                                    <var class="jia">+</var>
                                </p>
                                <p style="margin-bottom: 20px;">
                                    <span class="w-stock" data-count='{$product.stock}'>库存 {$product.stock} 吨</span>
                                </p>
                                <div class="w-shop-btn">
                                    <a data-id="{$product.product_id}" data-price="{$product.price}" class="w-shop-btn1" href="javascript:;">加入购物车</a>
                                    <!-- http://ucenter.znc365.com/index.php/auth/isLogin 验证登录-->
                                    <!-- http://ucenter.znc365.com/index.php/product/addcart 登录后加入购物车  product_id 商品id count 数量  price 价格 product_name 商品名称-->
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

            </div>

        </div>
        <script>

                $('.w-shop-btn1').on('click',function(){
                    var count=$('.w-stock').attr('data-count');
                    if($.trim($('.w-num').val())<1){
                        alert('产品数量不能小于0!');
                    }else if($.trim($('.w-num').val())>count){
                        alert('产品数量不能大于库存数!');
                    }else{
                        var _id=$(this).attr('data-id');
                        var _price=$(this).attr('data-price');
                        $.ajax({
                            url:'http://ucenter.znc365.com/index.php/auth/isLogin',
                            type:'GET',
                            async:false,
                            data:'',
                            success:function(data){
                                if(data.code==200){
                                    if(data.data==0){
                                        alert('你还没有登录,请先登录!');
                                         $('.w-yn-login-mash').fadeIn();
                                         $('.w-login').show();
                                         $('.pp').val('1');
                                    }else if (data.data==1) {
                                        $.ajax({
                                            url:'http://ucenter.znc365.com/index.php/product/addcart',
                                            type:'POST',
                                            data:{
                                                'product_id':_id,
                                                'count':$('.w-num').val(),
                                                'price':_price,
                                                'product_name':$('.pro-name').text()
                                            },
                                            success:function(data){
                                                console.log(data)
                                                if(data.code==200){
                                                    window.location.href='http://ucenter.znc365.com/member.php/shop/cart';
                                                }else{
                                                    alert(data.message);
                                                }
                                            }
                                        })
                                        
                                    }
                                }else{
                                    alert('获取登录状态失败!')
                                }
                            }
                        })
                    }
                    
                });





            $('.w-num').blur(function () {
                if ($(this).val() == '') {
                    $(this).val('1');
                }
            })
            $('.jian').on('click', function () {
                var val1 = $('.w-num').val();
                if (val1 > 1) {
                    val1--;
                    $('.w-num').val(val1)
                }

            });
            $('.jia').on('click', function () {
                var val1 = $('.w-num').val();
                var count=$('.w-stock').attr('data-count');
                val1++;
                if(val1>count){
                    $('.w-num').val(count)  
                }else{
                    $('.w-num').val(val1)  
                }
                
            });
        </script>
        <div class="met-showproduct-body">
            <div class="container">
                <div class="row no-space">
                    <div style="height:auto;" class="col-md-9 product-content-body">
                        <div class="row">
                            <div class="panel product-detail">
                                <div class="panel-body">
                                    <ul class="nav nav-tabs nav-tabs-line met-showproduct-navtabs affix-nav">
                                        <li class="active">
                                            <a data-toggle="tab" href="javascript:;"
                                               data-get="product-details">详细信息</a>
                                        </li>
                                    </ul>
                                    <div class="tab-content">
                                        <div class="tab-pane met-editor lazyload clearfix animation-fade active"
                                             id="product-details">
                                            <div>
                                                <p>{$product.desc}<br></p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!--右侧开始 热门推荐-->
                    <div class="col-md-3">
                        <div class="row">
                            <div class="panel product-hot">
                                <div class="panel-body">
                                    <h4 class="example-title">热门推荐</h4>
                                    <ul class="blocks-2 blocks-sm-3 mob-masonry" data-scale="1">
                                        {volist name='hots' id='hot'}
                                        <li>
                                            <a href="{:get_index('product/detail',['product_id'=>$hot.product_id])}"
                                               target="_blank" class="img" title="{$hot.name}">
                                                <img data-original="{$hot.cover|get_uploads}"
                                                     class="cover-image" style="height:200px;" alt="{$hot.name}">
                                            </a>
                                            <a href="javascript:;"
                                               target="_blank" class="txt" title="{$hot.name}">{$hot.name}</a>
                                        </li>
                                        {/volist}
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--右侧结束-->
                </div>
            </div>
        </div>
    </div>
    <!--底部-->
 {include file="./public/static/block/index/foot.html"}
